/** *通用形列表 */
<template>
    <div class="generalTable">
        <GeneralTableForm
            v-model:formArr="formArr"
            v-model:formDataNew="formDataNew"
            v-model:formDataOriginal="formDataOriginal"
            v-model:isFoldNum="isFoldNum"
            @tableSearch="tableSearch"
        />
        <GeneralTableButton v-model:buttonArr="buttonArr" />
        <GeneralTableTabs v-model:tabArr="tabArr" v-model:tabActiveName="tabActiveName" @tabChange="tabChange" />
        <GeneralTableList v-model:tableObj="tableObj" ref="generalTableList" />
        <GeneralTablePagination v-model:paginationObj="paginationObj" />
        <GeneralTableDialog v-model:dialogObj="dialogObj" @tableSearch="tableSearch" />
    </div>
</template>

<script lang="ts" setup>
    import { ref, reactive, markRaw, onBeforeMount, onMounted, onBeforeUnmount, nextTick, computed, watch } from 'vue';
    import type { Ref, Raw } from 'vue';
    import {} from '@/apis';
    import { isPhone } from '@/utils';

    import { useRoute, useRouter } from 'vue-router';
    import { storeToRefs } from 'pinia';
    import { useStore } from '@/store';
    import { ElMessage } from 'element-plus';
    import { Lock, User, Monitor, Phone, Search, RefreshRight } from '@element-plus/icons-vue';
    import GeneralTableForm from './components/generalTableForm/GeneralTableForm.vue';
    import GeneralTableButton from './components/generalTableButton/GeneralTableButton.vue';
    import GeneralTableTabs from './components/generalTableTabs/GeneralTableTabs.vue';
    import GeneralTableList from './components/generalTableList/GeneralTableList.vue';
    import GeneralTablePagination from './components/generalTablePagination/GeneralTablePagination.vue';
    import GeneralTableDialog from './components/generalTableDialog/GeneralTableDialog.vue';

    const route = useRoute();
    const router = useRouter();
    const store = useStore();
    const generalTableList = ref(null); //这个先不用，用其他替代方案
    // onMounted(() => {
    //     console.log(generalTableList.value)
    // })
    const formArr = defineModel<any>('formArr', {
        required: false,
        default: [
            // {
            //     fieldName: 'divisionCodes', //字段
            //     fieldValue: [], //字段默认值
            //     fieldText: '行政区划', //字段文字
            //     fieldType: 'administrativeDivisionsCascader', //类型 input select date cascader administrativeDivisionsCascader(行政区划特殊选项)
            //     fieldDisabled: false, //是否禁用
            //     fieldRules: [
            //         //规则
            //         // {
            //         //     required: true,
            //         //     message: '请选择行政区划！',
            //         //     trigger: 'blur'
            //         // }
            //     ],
            //     // input输入框
            //     inputType: '', //类型 number
            //     inputMaxLength: '', //最大输入长度 数字
            //     // select选项框
            //     selectmultiple: false, //select是否多选
            //     selectMultipleLimit: 0, //multiple 属性设置为 true 时，代表多选场景下用户最多可以选择的项目数， 为 0 则不限制
            //     selectCollapseTags: false, //多选时是否将选中值按文字的形式展示
            //     selectcollapseTagsTooltip: false, //当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此属性，collapse-tags属性必须设定为 true
            //     selectOptions: [], //select选项
            //     selectDictionary: GENERAL_REMOTE_OPTIONS[0], //select字典选项，填这个就不用填selectOptions
            //     // selectDefalutOptionsIndex: 0, //select默认选第几个选项,可以数字，字符串，数组，字符串和数组对应值也会是字符串或者数组
            //     // date选项框
            //     dateValueFormat: 'YYYY-MM-DD', //绑定值的格式YYYY-MM-DD
            //     dateType: 'date', //类型 date year month daterange monthrange yearrange
            //     dateDefaultValue: new Date(), //默认值 new Date(2010, 9, 1)
            //     // dateDisabledDate: (time) => {
            //     //     return time.getTime() > Date.now()
            //     // }
            //     // cascader选项框
            //     cascaderOptions: [
            //         //cascader选项
            //         // {
            //         //     value: 'guide',
            //         //     label: 'Guide',
            //         //     children: [
            //         //         {
            //         //             value: 'disciplines',
            //         //             label: 'Disciplines',
            //         //             children: [
            //         //                 {
            //         //                     value: 'consistency',
            //         //                     label: 'Consistency',
            //         //                 },
            //         //                 {
            //         //                     value: 'controllability',
            //         //                     label: 'Controllability',
            //         //                 },
            //         //             ],
            //         //         },
            //         //         {
            //         //             value: 'navigation',
            //         //             label: 'Navigation',
            //         //             children: [
            //         //                 {
            //         //                     value: 'side nav',
            //         //                     label: 'Side Navigation',
            //         //                 },
            //         //                 {
            //         //                     value: 'top nav',
            //         //                     label: 'Top Navigation',
            //         //                 },
            //         //             ],
            //         //         },
            //         //     ],
            //         // },
            //         // {
            //         //     value: 'resource',
            //         //     label: 'Resource',
            //         //     disabled: true,
            //         //     children: [
            //         //         {
            //         //             value: 'axure',
            //         //             label: 'Axure Components',
            //         //         },
            //         //         {
            //         //             value: 'docs',
            //         //             label: 'Design Documentation',
            //         //         },
            //         //     ],
            //         // },
            //     ],
            //     cascaderProps: {
            //         //cascader配置
            //         expandTrigger: 'hover',
            //         // multiple: true, //开启多选模式
            //         // checkStrictly: false, //是否严格的遵守父子节点不互相关联
            //         // lazy: true, //是否动态加载子节点，需与 lazyLoad 方法结合使用
            //         // lazyLoad(node, resolve) { //加载动态数据的方法，仅在 lazy 为 true 时有效
            //         //     const { level } = node
            //         //     setTimeout(() => {
            //         //         const nodes = Array.from({ length: level + 1 }).map((item, index) => ({
            //         //             value: `${level}- ${index}`,
            //         //             label: `Option - ${level}- ${index}`,
            //         //             leaf: level >= 2,
            //         //         }))
            //         //         // Invoke `resolve` callback to return the child nodes data and indicate the loading is finished.
            //         //         resolve(nodes)
            //         //     }, 1000)
            //         // },
            //     },
            //     cascaderShowAllLevels: true, //是否显示完整的路径，将其赋值为 false 则仅显示最后一级
            //     cascaderCollapseTags: true, //多选模式下是否折叠Tag
            //     cascaderCollapseTagsTooltip: true, //当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此属性，collapse-tags属性必须设定为 true
            //     cascaderMaxCollapseTags: 1, //需要显示的 Tag 的最大数量 只有当 collapse-tags 设置为 true 时才会生效。
            //     cascaderFilterable: true, //该选项是否可以被搜索
            // },
        ],
    });
    // formDataNew不用给值，里面会根据formArr的值来赋值，只是用作其他查询需要值，这个值在不点查询的情况也会根据输入框的改变而改变，所以除了点击查询以外用formDataOriginal
    const formDataNew = defineModel<any>('formDataNew', {
        required: false,
        default: {},
    });
    const formDataOriginal = defineModel<any>('formDataOriginal', {
        required: false,
        default: {},
    });
    const dialogObj = defineModel<any>('dialogObj', {
        required: false,
        default: {
            // dialogTitle: false, //dialog标题
            // dialogVisible: false, //dialog显示
            // dialogComponent: '', //组件
            // dialogParams: {}, //组件参数
        },
    });
    // 可以不用给值，里面有默认值
    const isFoldNum = defineModel<number>('isFoldNum', {
        required: false,
        default: 20,
    });
    const buttonArr = defineModel<any>('buttonArr', {
        required: false,
        default: [
            // {
            //     buttonType: 'primary', //类型
            //     buttonPlain: false, //是否为朴素按钮
            //     buttonRound: false, //是否为圆角按钮
            //     buttonCircle: false, //是否为圆形按钮
            //     buttonIcon: markRaw(Plus), //图标组件
            //     buttonDisabled: false, //按钮是否为禁用状态
            //     buttonLink: false, //是否为链接按钮
            //     buttonText: false, //是否为文字按钮
            //     buttonBg: false, //是否显示文字按钮背景颜色
            //     buttonLoading: false, //是否为加载中状态
            //     buttonLoadingIcon: '', //自定义加载中状态图标组件
            //     buttonColor: '', //自定义按钮颜色, 并自动计算 hover 和 active 触发后的颜色
            //     buttonDark: '', //dark 模式, 意味着自动设置 color 为 dark 模式的颜色
            //     buttonMainText: '新增', //按钮文字
            //     buttonClick: () => {
            //         //按钮事件
            //         // console.log('按钮事件')
            //         dialogObj.value.dialogParams = {};
            //         dialogObj.value.dialogComponent = InstitutionalManagementListEdit;
            //         dialogObj.value.dialogTitle = '新增';
            //         dialogObj.value.dialogVisible = true;
            //     },
            // },
        ],
    });
    const tabArr = defineModel<any>('tabArr', {
        required: false,
        default: [
            // {
            //     tabLabel: '第一个', //选项卡标题
            //     tabName: '第一个', //与选项卡绑定值 value 对应的标识符，表示选项卡别名。默认值是tab面板的序列号，如第一个 tab 是 0
            //     tabDisabled: false, //是否禁用
            //     badgeValue: 0, //显示值
            //     badgeMax: 99, //最大值，超过最大值会显示 {max}+。 只有当 value 是数字类型时起作用。
            //     badgeIsDot: false, //是否显示小圆点。
            //     badgeHidden: false, //是否隐藏 Badge。
            //     badgeType: 'danger', //badge type.
            //     badgeShowZero: true, //值为零时是否显示 Badge
            //     badgeColor: '', //背景色
            //     badgeOffset: [10, 0], //badge 的偏移量
            // },
        ],
    });

    const tableObj = defineModel<any>('tableObj', {
        required: false,
        default: {
            tableData: [],
            tableColumn: [],
            // tableData: formData1.value.familyInfo.guardians,
            // tableColumn: [
            //     {
            //         tableProp: '', //字段名称 对应列内容的字段名， 也可以使用 property属性
            //         tableLabel: '', //显示的标题
            //         // tableWidth: '100', //对应列的宽度
            //         tableMinWidth: '50', //对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列
            //         tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
            //         tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
            //         tableType: 'selection', //对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮
            //         tableAlign: 'left', //对齐方式'left' | 'center' | 'right'
            //         tableHeaderAlign: 'left', //表头对齐方式， 若不设置该项，则使用表格的对齐方式'left' | 'center' | 'right'
            //         tableChildren: [
            //             //多级表头需要
            //             // {
            //             //     tableProp: 'gender',
            //             //     tableLabel: 'Gender',
            //             //     tableWidth: '300',
            //             //     tableShowOverflowTooltip: true, //当内容太长时，它会分成多行。您可以使用 show-overflow-tooltip 将其保留在一行中。属性 show-overflow-tooltip 接受一个布尔值。 为 true 时多余的内容会在 hover 时以 tooltip 的形式显示出来。
            //             //     tableFixed: false, //它接受 Boolean 值。 如果为 true, 列将被左侧固定. 它还接受传入字符串，left 或 right，表示左边固定还是右边固定。
            //             // },
            //         ],
            //         tableSortable: false, //在列中设置 sortable 属性即可实现以该列为基准的排序， 接受一个 Boolean，默认为 false。 可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。
            //         // tableFilters: [ //数据过滤的选项， 数组格式，数组中的元素需要有 text 和 value 属性。 数组中的每个元素都需要有 text 和 value 属性。
            //         //     // { text: 'Home', value: 'Home' },
            //         //     // { text: 'Office', value: 'Office' },
            //         // ],
            //         // tableFilterMethod: (value, row, column) => { //数据过滤使用的方法， 如果是多选的筛选项，对每一条数据会执行多次，任意一次返回 true 就会显示。
            //         //     const property = column['property']
            //         //     return row[property] === value
            //         // },
            //         // tableFilterPlacement: 'bottom-end', //过滤弹出框的定位'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'
            //         // tableContentType: 'button', //column定制内容类型input select date cascader button text image
            //         // tableContentDisabled: false, //是否禁用
            //         // tableContentDefaultValue: '', //默认值
            //         // tableContentRules: [ //规则
            //         //     // {
            //         //     //     required: true,
            //         //     //     message: '请输入！',
            //         //     //     trigger: 'blur'
            //         //     // }
            //         // ],
            //         // image类型
            //         // tableContentImageHeight: '10vw', //图片框高度
            //         // text类型
            //         // tableContentTextBg: (val) => {
            //         //     console.log(val);
            //         //     if (val.row.name == '一级（高风险）') {
            //         //         return '#dc3545';
            //         //     } else if (val.row.name == '二级（中高风险）') {
            //         //         return '#ffc107';
            //         //     } else if (val.row.name == '三级（中低风险）') {
            //         //         return '#007bff';
            //         //     } else if (val.row.name == '四级（低风险）') {
            //         //         return '#28a745';
            //         //     } else {
            //         //         return '#007bff';
            //         //     }
            //         // },
            //         // button类型
            //         // tableContentButtons: [ // //column定制按钮
            //         //     {
            //         //         tableContentButtonType: 'primary', //按钮类型
            //         //         tableContentButtonPlain: false, //是否为朴素按钮
            //         //         tableContentButtonRound: false, //是否为圆角按钮
            //         //         tableContentButtonCircle: false, //是否为圆形按钮
            //         //         tableContentButtonIcon: Edit, //图标组件
            //         //         tableContentButtonDisabled: (val: any) => { return false; }, //按钮是否为禁用状态
            //         //         tableContentButtonText: false, //是否为文字按钮
            //         //         tableContentButtonLink: false, //是否为链接按钮
            //         //         tableContentButtonBg: false, //是否显示文字按钮背景颜色
            //         //         tableContentButtonLoading: false, //是否为加载中状态
            //         //         tableContentButtonLoadingIcon: '', //自定义加载中状态图标组件
            //         //         tableContentButtonColor: '', //自定义按钮颜色, 并自动计算 hover 和 active 触发后的颜色
            //         //         tableContentButtonDark: '', //dark 模式, 意味着自动设置 color 为 dark 模式的颜色
            //         //         tableContentButtonMainText: '修改', //按钮文字
            //         //         tableContentButtonClick: (val) => {
            //         //             console.log(val)
            //         //         },
            //         //     },
            //         // ],
            //         // input类型
            //         // tableContentInputType: 'text', //类型 number
            //         // tableContentInputMaxLength: '', //最大输入长度 数字
            //         // // select选项
            //         // tableContentSelectmultiple: false, //select是否多选
            //         // tableContentSelectMultipleLimit: 0, //multiple 属性设置为 true 时，代表多选场景下用户最多可以选择的项目数， 为 0 则不限制
            //         // tableContentSelectCollapseTags: false, //多选时是否将选中值按文字的形式展示
            //         // tableContentSelectcollapseTagsTooltip: false, //当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此属性，collapse-tags属性必须设定为 true
            //         // // tableContentSelectOptions: [], //select选项
            //         // tableContentSelectDictionary: GENERAL_REMOTE_OPTIONS[0], //select字典选项，填这个就不用填selectOptions
            //         // // tableContentSelectDefalutOptionsIndex: 0, //select默认选第几个选项,可以数字，字符串，数组，字符串和数组对应值也会是字符串或者数组
            //         // // date选项
            //         // tableContentDateValueFormat: 'YYYY-MM-DD', //绑定值的格式YYYY-MM-DD
            //         // tableContentDateType: 'date', //类型 date year month daterange monthrange yearrange
            //         // tableContentdateDefaultValue: new Date(), //默认值 new Date(2010, 9, 1)
            //         // tableContentDateDisabledDate: (time) => {
            //         //     return time.getTime() > Date.now()
            //         // }
            //         //  // cascader选项框
            //         //  tableContentCascaderOptions: [ //cascader选项
            //         //     {
            //         //         value: 'guide',
            //         //         label: 'Guide',
            //         //         children: [
            //         //             {
            //         //                 value: 'disciplines',
            //         //                 label: 'Disciplines',
            //         //                 children: [
            //         //                     {
            //         //                         value: 'consistency',
            //         //                         label: 'Consistency',
            //         //                     },
            //         //                     {
            //         //                         value: 'controllability',
            //         //                         label: 'Controllability',
            //         //                     },
            //         //                 ],
            //         //             },
            //         //             {
            //         //                 value: 'navigation',
            //         //                 label: 'Navigation',
            //         //                 children: [
            //         //                     {
            //         //                         value: 'side nav',
            //         //                         label: 'Side Navigation',
            //         //                     },
            //         //                     {
            //         //                         value: 'top nav',
            //         //                         label: 'Top Navigation',
            //         //                     },
            //         //                 ],
            //         //             },
            //         //         ],
            //         //     },
            //         //     {
            //         //         value: 'resource',
            //         //         label: 'Resource',
            //         //         disabled: true,
            //         //         children: [
            //         //             {
            //         //                 value: 'axure',
            //         //                 label: 'Axure Components',
            //         //             },
            //         //             {
            //         //                 value: 'docs',
            //         //                 label: 'Design Documentation',
            //         //             },
            //         //         ],
            //         //     },
            //         // ],
            //         // tableContentCascaderProps: { //cascader配置
            //         //     expandTrigger: 'hover',
            //         //     // multiple: true, //开启多选模式
            //         //     // checkStrictly: false, //是否严格的遵守父子节点不互相关联
            //         //     // lazy: true, //是否动态加载子节点，需与 lazyLoad 方法结合使用
            //         //     // lazyLoad(node, resolve) { //加载动态数据的方法，仅在 lazy 为 true 时有效
            //         //     //     const { level } = node
            //         //     //     setTimeout(() => {
            //         //     //         const nodes = Array.from({ length: level + 1 }).map((item, index) => ({
            //         //     //             value: `${level}- ${index}`,
            //         //     //             label: `Option - ${level}- ${index}`,
            //         //     //             leaf: level >= 2,
            //         //     //         }))
            //         //     //         // Invoke `resolve` callback to return the child nodes data and indicate the loading is finished.
            //         //     //         resolve(nodes)
            //         //     //     }, 1000)
            //         //     // },
            //         // },
            //         // tableContentCascaderShowAllLevels: true, //是否显示完整的路径，将其赋值为 false 则仅显示最后一级
            //         // tableContentCascaderCollapseTags: true, //多选模式下是否折叠Tag
            //         // tableContentCascaderCollapseTagsTooltip: true, //当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此属性，collapse-tags属性必须设定为 true
            //         // tableContentCascaderMaxCollapseTags: 1, //需要显示的 Tag 的最大数量 只有当 collapse-tags 设置为 true 时才会生效。
            //         // tableContentCascaderFilterable: true, //该选项是否可以被搜索
            //         // tableIndex: (index) => { //如果设置了 type=index，可以通过传递 index 属性来自定义索引
            //         //     return index * 2
            //         // },
            //         // tableSelectable: [], //仅对 type=selection 的列有效，类型为 Function，Function 的返回值用来决定这一行的 CheckBox 是否可以勾选
            //     },
            // ],
            // tableFormItemProp: '', //编辑页的表格内容的el-form-item的prop
            // tableBorder: true, //是否带有纵向边框
            // tableStripe: true, //是否为斑马纹 table
            // tableRowClassName: ({
            //     //自定义每一行的样式
            //     row,
            //     rowIndex,
            // }) => {
            //     row.rowIndex = rowIndex; //给表格数据增加唯一值，不然新增数据后选中会变成全选
            //     // if (rowIndex === 1) {
            //     //     return 'warning-row'
            //     // } else if (rowIndex === 3) {
            //     //     return 'success-row'
            //     // }
            //     return '';
            // },
            // // tableHeight: '500', //已经通过样式设置了flex=1，高度不用再设置  table 的高度。 默认为自动高度。 如果 height 为 number 类型，单位 px；如果 height 为 string 类型，则这个高度会设置为 Table 的 style.height 的值，Table 的高度会受控于外部样式。
            // tableMaxHeight: '500', //已经通过样式设置了flex=1，高度不用再设置  table 的最大高度。 合法的值为数字或者单位为 px 的高度。
            // tableHighlightCurrentRow: false, //是否要高亮当前行
            // tableFit: true, //列的宽度是否自撑开
            // tableShowHeader: true, //是否显示表头
            // tableCurrentChange: (currentRow, oldCurrentRow) => {
            //     //当表格的当前行发生变化的时候会触发该事件，如果要高亮当前行，请打开表格的 highlight-current-row 属性
            //     // console.log(currentRow)
            //     // console.log(oldCurrentRow)
            // },
            // tableRowDblclick: (row, column, event) => {
            //     //当某一行被双击时会触发该事件
            //     // console.log(row)
            //     // console.log(column)
            //     // console.log(event)
            // },
            // // tableDefaultSort: '', //默认的排序列的 prop 和顺序。 它的 prop 属性指定默认的排序的列，order 指定默认排序的顺序，例子{ prop: 'date', order: 'descending' }
            // tableFormatter: (row, column) => {
            //     //它用于格式化指定列的值
            //     // return row.address
            // },
            // tableRowKey: '', //行数据的 Key，用来优化 Table 的渲染； 在使用reserve-selection功能与显示树形数据时，该属性是必填的。 类型为 String 时，支持多层访问：user.info.id，但不支持 user.info[0].id，此种情况请使用 Function。
            // tableDefaultExpandAll: false, //是否默认展开所有行，当 Table 包含展开行存在或者为树形表格时有效
            // tableShowSummary: false, //是否在表尾显示合计行
            // tableLayout: 'fixed', //设置表格单元、行和列的布局方式
            // tableSelection: [], //选择项的值
            // tableSelectionChange: (newSelection) => {
            //     //当选择项发生变化时会触发该事件
            //     tableObj1.value.tableSelection = newSelection;
            //     // console.log(tableObj1.value.tableSelection)
            // },
            // tableIsShowEditButton: true, //是否显示新增和删除按钮
        },
    });

    const tabActiveName = defineModel<string>('tabActiveName', {
        required: false,
        default: '',
    });
    const paginationObj = defineModel<any>('paginationObj', {
        required: false,
        default: {
            // paginationTotal: 0, //总条目数
            // paginationPageSize: 100, //每页默认的条目个数，不设置时默认为10
            // paginationCurrentPage: 1, //当前页数
            // // paginationPageCount: 11, //总页数， total 和 page-count 设置任意一个就可以达到显示页码的功能；如果要支持 page-sizes 的更改，则需要使用 total 属性
            // paginationPageSizes: [100, 200, 300, 400], //展示的选择每页显示个数的选项，[100, 200, 300, 400] 表示四个选项，每页显示 100 个，200 个，300 个或者 400 个。
            // paginationSlotText: '', //slot文字内容
            // paginationisShow: true, //是否显示
            // paginationLayout: 'slot, total, sizes, prev, pager, next, jumper', //prev (上一页按钮), next (下一页按钮), pager (分页列表), jumper (跳转), total (总计), sizes (每页条数选择), slot(插槽) 和 -> (every element after this symbol will be pulled to the right).
            // paginationPagerCount: 11, //设置最大页码按钮数。 页码按钮的数量，当总页数超过该值时会折叠
            // paginationBackground: true, //为分页按钮添加背景色
            // paginationSize: 'default', //更改大小
            // paginationDisabled: false, //禁用
            // paginationHideOnSinglePage: false, //隐藏分页
            // paginationDefaultCurrentPage: 1, //当前页数的默认初始值，不设置时默认为 1
            // paginationSizeChange: (val: number) => {
            //     //处理页码大小
            //     // console.log(tabActiveName.value)
            //     // console.log(paginationObj.value.paginationCurrentPage)
            //     // console.log(paginationObj.value.paginationPageSize)
            //     // console.log(paginationObj.value.paginationTotal)
            //     tableSearch();
            // },
            // paginationCurrentChange: (val: number) => {
            //     //当前页变动时候触发的事件
            //     // console.log(formDataNew.value)
            //     // console.log(tabActiveName.value)
            //     // console.log(paginationObj.value.paginationCurrentPage)
            //     // console.log(paginationObj.value.paginationPageSize)
            //     // console.log(paginationObj.value.paginationTotal)
            //     tableSearch();
            // },
        },
    });
    // const props = withDefaults(defineProps<{
    //     isFoldNum?: number,
    // }>(), {
    //     isFoldNum: 20,
    // })
    const emits = defineEmits<{
        // (e: 'update:isCollapse', data: boolean): void,
        tableSearch: [data: any];
        tabChange: [data: any];
    }>();

    const tableSearch = (val) => {
        emits('tableSearch', val);
    };
    const tabChange = (val) => {
        emits('tabChange', val);
    };
</script>

<style lang="scss" scoped>
    .generalTable {
        width: 100%;
        height: 100%;
        background: #fff;
        box-sizing: border-box;
        padding: 20px;
        text-align: left;
        display: flex;
        flex-direction: column;
    }
</style>
